介紹
ApolloDataClient 在 React 部分提供了 React Native and Expo 可以直接用的功能，對於各種的 React Router 也友善支持，SSR部分也很容易設定，除了 HOC 用 Recompose 在組合ApolloData更有彈性 ， Next.js 已經是 React 主流SSR框架之一，ApolloData 也為 Next.js 使用者提供一個使用範例，可以更容易使用

官方範例
https://github.com/zeit/next.js/tree/master/examples/with-apollo

開始使用 React ApolloClient，至於ApolloClient 設定方法可以參考 前篇 https://ithelp.ithome.com.tw/articles/10191332 ，
這裡的差異性主要是 React 需要使用 ApolloProvider 包在TopLevel 並且給他client設定檔，
以下是 React 基本設定

import { ApolloProvider } from 'react-apollo';
import { ApolloClient } from 'apollo-client';
import { HttpLink } from 'apollo-link-http';
import { InMemoryCache } from 'apollo-cache-inmemory';

const client = new ApolloClient({
  link: new HttpLink(),
  cache: new InMemoryCache()
});

ReactDOM.render(
  <ApolloProvider client={client}>
    <MyAppComponent />
  </ApolloProvider>,
  document.getElementById('root')
)

使用 React 發出一個 Request ，Client 的語法都是使用 gql Es6 template literals寫作方式，ApolloData 2.0 使用 import gql from 'graphql-tag' ， gql 的方式來寫作 Json payload (1.X的引用gql套件不一樣這邊要注意)，另外這個元件必須有被 Wrap ApolloProvider，發出request 方法只需要使用 graphql Hoc 把 gql 與元件綁定，這樣就可以做 Request 發 Query 到設定檔指定的目錄的位置

import React, { Component } from 'react';
import { graphql } from 'react-apollo';
import gql from 'graphql-tag';

const MY_QUERY = gql`query { todos { text } }`;

const MyComponentWithData = graphql(MY_QUERY)(props => <div>...</div>);

總結

ApolloData 提供了 React graphql HOC綁定 gql 語法 再把結果當作 Props 傳遞到元件之中
，前端工作只要寫好 Json payload 直接透過 graphql(語法)(元件) 綁好 一切就搞定了，上面案例如果Query有打資料回來就可以在元件中的 props.data 找到 server 回傳資料